<!--
<ion-view>
  <ion-nav-title>
    <h1>毛玻璃</h1>
  </ion-nav-title>
  <ion-content  padding="true" start-y="120">
    <ol class="messages">
      <li ng-repeat="message in messages"  ng-bind-html="message.content">
      </li>
    </ol>
  </ion-content>
  <footer class="bar bar-footer bar-frosted">
    <button class="button button-clear button-positive" ng-click="add()">添加消息</button>
  </footer>

</ion-view>
-->

<ion-view id="userMessagesView"
          cache-view="false"
          view-title="123">

  <div class="loader-center" ng-if="!doneLoading">
    <div class="loader">
      <i class="icon ion-loading-c"></i>
    </div>
  </div>

  <ion-content has-bouncing="true" class="has-header has-footer"
               delegate-handle="userMessageScroll">

    <div ng-repeat="message in messages" class="message-wrapper"
         on-hold="onMessageHold($event, $index, message)">

      <div ng-if="user._id !== message.userId">

        <img ng-click="viewProfile(message)" class="profile-pic left"
             ng-src="{{toUser.pic}}"/>

        <div class="chat-bubble left">

          <div class="message" ng-bind-html="message.text">
          </div>

          <div class="message-detail">
                        <span ng-click="viewProfile(message)"
                              class="bold">{{toUser.username}}</span>,
            <span am-time-ago="message.date"></span>
          </div>

        </div>
      </div>

      <div ng-if="user._id === message.userId">

        <img ng-click="viewProfile(message)" class="profile-pic right"
             ng-src="{{user.pic}}" onerror="onProfilePicError(this)"/>

        <div class="chat-bubble right">

          <div class="message" ng-bind-html="message.text" autolinker>
          </div>

          <div class="message-detail">
                        <span ng-click="viewProfile(message)"
                              class="bold">{{user.username}}</span>,
            <span am-time-ago="message.date"></span>
          </div>

        </div>

      </div>

      <div class="cf"></div>

    </div>
  </ion-content>

  <form name="sendMessageForm" ng-submit="sendMessage(sendMessageForm)" novalidate>
    <ion-footer-bar class="bar-stable item-input-inset message-footer" keyboard-attach>
      <label class="item-input-wrapper">
        <textarea ng-model="input.message" value="" placeholder="Send {{toUser.username}} a message..." required
                  minlength="1" maxlength="1500" msd-elastic></textarea>
      </label>

      <div class="footer-btn-wrap">
        <button class="button button-icon icon ion-android-send footer-btn" type="submit"
                ng-disabled="!input.message || input.message === ''">
        </button>
      </div>
    </ion-footer-bar>
  </form>

</ion-view>